
/* ------------------------------------------------------------
  ui-components v0.9
  Create: 2012-09-14
  Last Updated: 2012-09-29
  Author: Cloudyan
  Description: 包含最常用且基本的组件(不要轻易修改此样式表中的样式，详询Author)
------------------------------------------------------------ */

/* （页面html说明举例）搜索页面主体内容 
 * 边栏盒模型aside-box 单独定义盒子请附加具体的盒子名称，样式在自定义class名下定义
 * 如有边框添加class="lv-bd"
 * 尽量保持结构设计上的统一，保持页面中的注释风格，示例如下：
 * 注释开始 <!-- 盒子功能名称\\ -->
 * 注释结束 <!-- //盒子功能名称 -->
 */

/**
 * @name      : Autocomplete Plugin
 * @explain   : 自动完成插件
 * @type      : 基类 .auto >> auto-big auto-list
 * @dependent : 无
 * @version   : 1.0
 * @html      :

 */


/* 自动补全插件样式并不在这里使用
.auto{font:12px/22px \5b8b\4f53,Tahoma,Arial; width:277px; overflow:hidden;border:1px solid #dbdbdb;background: #fff;
box-shadow:2px 2px 2px 0 rgba(102,102,102,0.2);}
.auto a{color:#333; text-decoration:none}
.auto a:hover{ color:#e08; text-decoration:underline}
.auto-line{color:#888; font-size:12px;font-weight:normal; margin:0;}
.auto-title{color:#999; font-size:12px; font-weight: normal; border-bottom:1px dotted #dbdbdb}
.auto-box{ padding:5px 10px;}
.auto-mini .auto-box,.auto-single .auto-box{ padding:0;}
.a2row,.a3row,.a4row,.a5row{ overflow:hidden;*zoom:1; margin-right:-2px; padding-top:2px; margin-bottom:10px;}
.a2row li,.a3row li,.a4row li,.a5row li{ float:left; display:inline;overflow:hidden;}
.a2row li{ width:49.5%}.a3row li{ width:33.25%}.a4row li{ width:24.9%}.a5row li{ width:19.9%}
.auto a{ display:block;white-space:nowrap;overflow:hidden; text-align:left;}
.auto-mini a{ padding:0 10px;}
.auto-single a{padding:2px 10px;}
.a2row a,.a3row a{margin-right:10px;text-overflow:ellipsis;}
.auto-mini a,.auto-single a{text-overflow:ellipsis;color:#333;}
.auto-mini a:hover,.auto-single a:hover{ background:#ff9cc0;color:#fff; text-decoration:none}
.auto-mini li,.auto-single li{_float:left;clear:both;_width:100%}
.auto-mini a,.auto-single a{_float:left;_width:100%;}
.auto-big{ width:355px;}
.auto-middle{width:277px;}
.auto-small{ width:235px;}
.auto-mini{ width:137px;}
.auto-type{color:#888}
.auto-single a:hover .auto-type{color:#fff;}
.auto-channel .auto-type{color:#ee0088; font-weight:bold}
.auto-channel li{ background:#efeceb; margin-top:1px;}
 */
.orange{font-style:normal;color:#f60;}
/* 活动促销icon
 * icon101  节日-红色(按顺序排列) 元旦 清明 五一 端午 中秋 国庆 微旅游日
 * icon201	促销-橙色 多人多惠 礼盒 促销 热卖 新品
 * icon301	项目-多彩 超级自由行 开心驴行
 * icon-sp1	促销-大ICON 信用卡促销 多人多惠 早订优惠 招行专享
 * icon-01  标识-景点
 */
.icon-item,.icon-item-last,.icon-tag,.icon-tag2,.icon-type1,.icon-type2,.icon-type3,
.icon-01,
.icon101,.icon102,.icon103,.icon104,.icon105,.icon106,.icon07,
.icon201,.icon202,.icon203,.icon204,.icon205,
.icon301,.icon302,
.icon-sp1,.icon-sp2,.icon-sp3,.icon-sp4,.icon-sp5,.icon-sp6
{ background: url(../../../img/new_v/ob_search/combo.gif) no-repeat; display: inline-block;*display: inline;*zoom:1; vertical-align:top;*vertical-align:middle;font-family:Tahoma,Arial,\5b8b\4f53;text-indent:0;}
.icon-tag,.icon-tag2{height:16px;line-height:16px;padding:0 5px;font-weight:normal;font-size:12px;margin-left:4px;color:#fff;margin-top:2px;_overflow:hidden;_line-height:17px;_margin-top:0;}
.icon-tag{background-position:right -79px;}
.icon-tag,.icon-tag2{background:#ff9614;padding:0 4px;font-style:normal;}
.icon-01{ height:16px; width:16px;margin-top:2px;*margin-top:0;}
.icon-01{ background-position: 0 -96px;}
.icon101,.icon102,.icon103,.icon104,.icon105,.icon106,.icon07,
.icon201,.icon202,.icon203,.icon204,.icon205
{height: 16px;width: 33px; margin-top:2px;*margin-top:0; margin-left:10px;}
/* icon101	节日-红色(按顺序排列) 101元旦 102清明 103五一 104端午 105中秋 106国庆 107微旅游日 */
.icon101{ background-position: -122px 0} 
.icon102{ background-position: -155px -16px}
.icon103{ background-position: -122px -16px}
.icon104{ background-position: -155px -16px}
.icon105{ background-position: -122px -32px}
.icon106{ background-position: -155px -32px}
.icon107{ background-position: -122px -48px;width: 56px;}
/* icon201	促销-橙色 201多人多惠 202礼盒 203促销 204热卖 205新品 */
.icon201{ background-position: -122px -80px;width: 56px;}
.icon202{ background-position: -179px -80px;width: 12px;}
.icon203{ background-position: -122px -96px;}
.icon204{ background-position: -155px -96px;}
.icon205{ background-position: -122px -112px;}
/* icon301	项目-玫红 301超级自由行 302开心驴行 */
.icon301,.icon302
{height: 17px;width: 76px; margin-left:10px;}
.icon301{ background-position: -190px 0; width: 88px;}
.icon302{ background-position: -190px -17px; width: 76px;}
/* icon301	促销-大ICON -sp1信用卡促销 -sp2多人多惠 -sp3早订优惠 -sp4招行专享 */
.icon-sp1,.icon-sp2,.icon-sp3,.icon-sp4,.icon-sp5,.icon-sp6
{ width: 90px; height: 34px; margin-bottom:10px;}
.icon-sp1{ background-position: -32px 0}
.icon-sp2{ background-position: -32px -34px}
.icon-sp3{ background-position: -32px -68px}
.icon-sp4{ background-position: -32px -102px}
.icon-type1,.icon-type2,.icon-type3{ background: url(../../../img/new_v/ob_search/combo.gif) #ff77bb no-repeat; color:#fff;height:16px;line-height:16px;width:30px;padding-left:20px;}
.icon-type1{background-position:-190px -34px;}
.icon-type2{background-position:-190px -47px;}
.icon-type3{background-position:-190px -62px;}

/* 项目树 */
.icon-item,.icon-item-last{ width:20px;height:28px; line-height:28px; float:left}
.icon-item,.icon-item-last{ background: url(../../../img/new_v/ob_search/combo.gif) #f9f9f9 no-repeat;}
.icon-item{ background-position:0 0;}
.icon-item-last{ background-position:0 -24px;}

.cashback,.discount {border: 1px solid #ff9614; display: inline-block; *display: inline;*zoom:1; margin-top:2px;width:40px; height: 14px; line-height: 14px; overflow: hidden; padding:0 0 0 14px; text-align: center;color:#ff9614; text-indent: 0; margin-left:4px; vertical-align:top; *vertical-align:middle; cursor:default;font-family:Tahoma,Arial,\5b8b\4f53;text-indent:0;}
a.cashback:hover,.discount:hover{color:#ff9614; text-decoration:none}
.cashback i,.discount i{ float: left; display: inline; width:14px; margin-left: -14px; height: 100%; background: #ff9614;color: #fff;}
.discount{padding:0 0 0 52px;}
.discount i{width:52px; margin-left: -52px;font-style:normal}

/* pages页码小组件
 * 样式默认玫红色（可缺省rosestyle）
 * 可组合样式orangestyle橙色
 * @html
<div class="pages orangestyle"> <!-- <div id="lv_page"><div class="Pages">可缺省此两级嵌套 -->
	<span class="PageSel">1</span>
	<a href="#">2</a>
	<a href="#">3</a>
	<span class="more">...</span>
	<a href="#">下一页</a>
</div>
 */
.pages{margin:10px 0 0;text-align:right;}
.pages a,.pages span{display:inline-block;zoom:1;*display:inline;margin-left:5px;padding:0 9px;height:25px;line-height:25px;}
.pages a{border:1px solid #ddd;color:#333;background:#fff;}
.pages .PageSel,.rosestyle .PageSel{font-weight:bold;border:1px solid #df1a7a;color:#fff;background:#df1a7a;}
.pages a:hover,.rosestyle a:hover{ border-color:#df1a7a;color:#df1a7a; text-decoration:none}
.orangestyle .PageSel{font-weight:bold;border:1px solid #f80;color:#fff;background:#f80;}
.orangestyle a:hover{ border-color:#f80;color:#f80; text-decoration:none}

/* 星星组件
 * span.big_star 大星星-方形玫红星-无灰色背景（底灰色星星）
 * span.re_star starbg 点评星星（灰色背景）
 * span.b_star 大星星-玫红星-透明背景（底灰色星星）
 * span.sm_star 小星星-玫红小星星
 * span.c_star 小星星-橙色实心
 * span.k_star mini星星-橙色空心
 * span.t_star mini星星-橙色实心（底空心星）
 * span.mt_star span.mk_star mini星星-频道特色酒店紧密型星星
 * @html
<span class="big_star"><i style="width:80%"></i></span>
 */
span.xc_star,
span.xc_star i,
span.xcm_star,
span.xcm_star i,
span.big_star,
span.big_star i,
span.b_star,
span.b_star i,
span.sm_star,
span.sm_star i,
span.t_star,
span.t_star i,
span.k_star i,
span.mt_star,
span.mt_star i,
span.mk_star i,
.re-star,
.starbg,
.starbg i,
span.c_star,
span.c_star i{ background:url(../../../img/new_v/channel/ico_s_result.gif) no-repeat;display:inline-block;*display:inline;*zoom:1;overflow:hidden;}
span.c_star,span.c_star i{width:80px;height:20px;background-position:-140px -122px;}
span.t_star,span.k_star{display:inline-block;overflow:hidden; height:10px;}
span.t_star,span.k_star{width:62px;}
span.t_star,span.t_star i,span.k_star i{ height:10px; background-position:-50px -100px;}
span.t_star i{background-position:-50px -111px;}
span.t_star i,span.k_star i,span.mt_star i,span.mk_star i{ float:left;}
span.sm_star,span.sm_star i{width:68px; height:12px; background-position:-180px -100px;}
span.sm_star i{background-position:-180px -111px; float:left;}
span.big_star,span.big_star i{ width:69px; height:13px; background-position:-24px 0;}
span.big_star i{background-position:-24px -16px; float:left;}
span.b_star,span.b_star i{ width:78px; height:12px; background-position:-27px -124px;}
span.b_star i{background-position:-27px -138px; float:left;}
.re-star,.starbg,.starbg i{ background-position:-250px -100px;width:80px; height:20px;}
.re-star{ padding:0 7px; overflow:hidden; vertical-align:middle}
.starbg{ background-position:-257px -100px;}
.starbg i{float:left; background-position:-257px -120px;}
/* 小星星扩展 */
span.star1{ width:12px}
span.star2{ width:24px}
span.star3{ width:37px}
span.star4{ width:49px}
span.star5{ width:62px}
.b_star .star1{ width:16px}
.b_star .star2{ width:32px}
.b_star .star3{ width:48px}
.b_star .star4{ width:64px}
.b_star .star5{ width:80px}
small.star{font-weight: normal; font-size:12px; line-height:11px; -webkit-text-size-adjust: none;}
small.star i{ width:100%;}
small.star span.t_star{ margin-right:5px;}
/* 小星星扩展-酒店等级 */
span.mt_star,span.mk_star{display:inline-block;overflow:hidden; height:10px;}
span.mt_star,span.mk_star{width:50px;}
span.mt_star,span.mt_star i,span.mk_star i{ height:10px; background-position:-250px -60px;}
span.mt_star i{background-position:-250px -70px;}
span.m_star1{ width:10px}
span.m_star2{ width:20px}
span.m_star3{ width:30px}
span.m_star4{ width:40px}
span.m_star5{ width:50px}
small.m_star{font-weight: normal; font-size:12px; line-height:11px; -webkit-text-size-adjust: none;}
small.m_star i{siaplay:inline-block; width:100%;}
small.m_star span.mt_star{ margin-right:5px;}

/* 翻页小组件 */
.pageoper{color:#555}
.page-arrow,i.arrow{ background:url(../../../img/new_v/ob_search/combo.gif) 1000px 1000px no-repeat; display:inline-block; *display:inline;*zoom:1;}
.page-arrow { width:16px; height:16px; overflow:hidden; position:absolute; top:2px; _top:1px;}
.page-arrow-left{background-position:0 -80px; left:0px;}
.page-arrow-right{background-position:-14px -80px; right:0px;}
.page-prev,.page-next{ display:inline-block;*display:inline;*zoom:1; border:1px solid #dfdfdf; height:20px;line-height:20px; background:#fff; color:#555; position:relative}
.page-prev{ padding:0 4px 0 15px;}
.page-next{ padding:0 15px 0 4px;}
a.page-prev:hover,a.page-next:hover{color:#555; text-decoration:none; border-color:#FFB8DB;}

/* 新点评星星 */
span.xc_star,span.xc_star i{width:85px;height:15px;background-position:-241px -210px;}
span.xc_star{background-position:-241px -228px;}
span.xc_star i,span.xcm_star i{float:left;}
span.xcm_star,span.xcm_star i{width:63px;height:12px;background-position:-241px -245px;}
span.xcm_star{background-position:-241px -257px;}

.xcm_star{position:relative;top:2px;}

/* view-more arrow 展开/收起-箭头 */
.view-more,.hide-more{ display:inline-block;*display:inline;*zoom:1; line-height:22px; cursor:pointer}
i.arrow{ background-position:0 -112px;width:16px; height:16px; margin:2px 0 0 3px; vertical-align:top; *vertical-align:baseline}
.view-more .arrow{ background-position:0 -112px; }
.hide-more .arrow{background-position:-16px -112px; }

/**
 * @name      : tooltip
 * @explain   : 提示
 * @type      : 基类
 * @dependent : 无
 * @author    : Cloudyan
 * @version   : 1.0
 * @html      :

<div class="tooltip top">
	<div class="tooltip-arrow"></div>
	<div class="tooltip-outer">
		<div class="tooltip-shadow"></div>
		<div class="tooltip-inner">
			<h5 class="tooltip-title">标题</h5>
			<div class="tooltip-content"><p>内容</p></div>
		</div>
	</div>
</div>
 */

.tooltip {position: absolute;z-index: 1030;display: block; padding:5px; font-size: 12px;/*opacity: 0;filter: alpha(opacity=0);*/visibility: visible;}
/*.tooltip.in {opacity: 0.8;filter: alpha(opacity=80);}*/
.tooltip.top {margin-top: -3px;}
.tooltip.right {margin-left: 3px;}
.tooltip.bottom {margin-top: 3px;}
.tooltip.left {margin-left: -3px;}
.tooltip-outer {width:auto;max-width: 300px;min-width:80px;_width:260px; position:relative; overflow:hidden; padding:3px; z-index:10;
/*  border-bottom-color:rgba(129,129,129,1);
	-webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;*/
	
}
.tooltip-shadow{
	position:absolute; width:100%; height:100%; _width:265px; _height:200px; top:0; left:0;z-index:50;
	background:#000;
	opacity:0.1;
	filter: alpha(opacity=10);
}
.tooltip-inner{ position:relative; z-index:101; left:0; top:0; padding:5px 8px; background:#fff;text-decoration:none; border:1px solid #c6c6c6; color:#333;zoom:1;/*opacity:1;filter: alpha(opacity=100);*/}
.tooltip-title{margin:0;color:#333; font-size:12px;font-weight: bold;line-height: 22px;}
.tooltip-content{color:#555; line-height:18px; font-size:12px;}
.tooltip-content p{margin:0;}
.tooltip-content span{color:#ff9714}
.tooltip-content b{font-weight:bold !important;}
.tooltip-arrow {position: absolute; z-index:100;width: 0;height: 0; overflow:hidden;border-color: transparent;border-style: solid;opacity:0.1;filter: alpha(opacity=10);}
.top .tooltip-arrow {bottom: 0;left: 50%;margin-left: -5px;border-top-color:#000;border-width: 5px 5px 0;}
.right .tooltip-arrow {top: 50%;left: 0;margin-top: -5px;border-right-color:#000;border-width: 5px 5px 5px 0;}
.left .tooltip-arrow {top: 50%;right: 0;margin-top: -5px;border-left-color:#000;border-width: 5px 0 5px 5px;}
.bottom .tooltip-arrow {top: 0;left: 50%;margin-left: -5px;border-bottom-color:#000;border-width: 0 5px 5px;}
asdasd{}
.bottom-left .tooltip-arrow,.bottom-right .tooltip-arrow{border-bottom-color:#000;border-width: 0 5px 5px;}
.bottom-left .tooltip-arrow {top: 0;left:25px;}
.bottom-right .tooltip-arrow {top: 0;left:100%; margin-left:-30px;}
.top-left .tooltip-arrow,.top-right .tooltip-arrow{border-top-color:#000;border-width: 5px 5px 0;}
.top-left .tooltip-arrow {bottom: 0;left:25px;}
.top-right .tooltip-arrow {bottom: 0;left:100%; margin-left:-30px;}


/* tooltip2 */
.tooltip2{background-color: #fffae4;border:1px solid #fc6;}
.tooltip2 .tooltip2-arrow{display:inline-block;width:20px;height:20px;border:none;position:absolute;opacity:1;filter: alpha(opacity=100);}
.tooltip2 .tooltip-content{line-height:22px;padding: 0 5px;}
.tooltip2 .tooltip-outer{max-width: 320px;width:320px;}
.tooltip2-arrow em,
.tooltip2-arrow i{position: absolute; z-index:100;width: 0;height: 0; overflow:hidden;border-color: transparent;border-style: solid;left:0;top:0;font-style: normal;border-width:0 9px 9px;}

.top .tooltip2-arrow,
.bottom .tooltip2-arrow{left: 50%;margin-left: -5px;}
.left .tooltip2-arrow,
.right .tooltip2-arrow{top: 50%;margin-top:-10px;}
.top-right .tooltip2-arrow,
.bottom-right .tooltip2-arrow{left:100%;margin-left:-50px;}
.top-left .tooltip2-arrow,
.bottom-left .tooltip2-arrow{left:0;margin-left:35px;}

.bottom .tooltip2-arrow,
.bottom-left .tooltip2-arrow,
.bottom-right .tooltip2-arrow{top:-10px}

.bottom-left .tooltip2-arrow em,
.bottom-right .tooltip2-arrow em,
.bottom .tooltip2-arrow em{border-bottom-color:#f60;}
.bottom-left .tooltip2-arrow i,
.bottom-right .tooltip2-arrow i,
.bottom .tooltip2-arrow i{top:1px;border-bottom-color:#fffae4;}

.top .tooltip2-arrow,
.top-left .tooltip2-arrow,
.top-right .tooltip2-arrow{bottom:-20px;}

.top-left .tooltip2-arrow em,
.top-right .tooltip2-arrow em,
.top .tooltip2-arrow em{border-top-color:#f60;border-width:9px 9px 0}
.top-left .tooltip2-arrow i,
.top-right .tooltip2-arrow i,
.top .tooltip2-arrow i{bottom:1px;border-top-color:#fffae4;border-width:9px 9px 0}
.left .tooltip2-arrow{left:-9px;}
.left .tooltip2-arrow em{border-right-color:#f60;border-width:9px 9px 9px 0}
.left .tooltip2-arrow i{right:1px;border-right-color:#fffae4;border-width:9px 9px 9px 0}
.right .tooltip2-arrow{left:100%;}
.right .tooltip2-arrow em{border-left-color:#f60;border-width:9px 0 9px 9px}
.right .tooltip2-arrow i{left:0px;border-left-color:#fffae4;border-width:9px 0 9px 9px}


/* 新的tags标签 tags.css: tagcc,tagback */
.tagscc,
.tagsback,
.tagsgift {
    display: inline-block;
    margin: 0 2px;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-indent:0;
    cursor: default;
}

.tagscc {
    padding: 0 4px;
    background: #ff9614;
    color: #fff;
    height: 16px;
    line-height: 16px;
}

.tagsback,
.tagsgift {
    font-size: 12px;
    height: 14px;
    line-height: 14px;
    text-decoration: none;
}

.tagscc:empty,
.tagsback:empty {
    display: none;
}

.tagsback {
    border: 1px solid #ff9614;
    color: #ff9614;
}

.tagsback:hover {
    text-decoration: none;
    color: #ff9614;
}

.tagsback em,
.tagsback i,
.tagsgift em,
.tagsgift i { 
    font-size: 12px;
    display: inline-block;
    font-style: normal;
    font-weight: normal !important;
    overflow: hidden;
    height: 100%;
}

.tagsback em,
.tagsgift em {
    display: inline-block;
    float: left;
    padding: 0 2px;
}

.tagsback em {
    background: #ff9614;
    color: #fff;
}

.tagsback i,
.tagsgift i { 
    padding: 0 3px;
    min-width: 30px;
    _width: 30px;
    font-family: font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    color: #ff9614;
}

.tagsgift,
.tagblue { 
    border: 1px solid #ccddee;
    color: #17afe3;
}

.tagsgift:hover,
.tagblue:hover { 
    text-decoration: none;
    color: #17afe3;
}

.tagsgift em,
.tagblue em { 
    background: #f0f5fc;
    color: #17afe3;
}

.tagsgift i,
.tagblue i { 
    color: #17afe3;
}

/* tags101 纯色标签 101橙色  102粉红  103红色  104绿色 105玫红  */
.tags101,
.tags102,
.tags103,
.tags104,
.tags105,
.tags106,
.tags107,
.tags108,
.tags109 {
    display: inline-block;
    margin: 0 2px;
    font-size: 12px;
    font-style: normal;
    font-weight: normal !important;
    text-indent:0;
    cursor: default;
    
    padding: 0 4px;
    background: #ff9614;
    color: #fff;
    height: 16px;
    line-height: 16px;
}
.tags101{ background: #ff8800;} /* 橙色 */
.tags102{ background: #fa65b0;} /* 粉红 */
.tags103{ background: #ff4444;} /* 红色 */
.tags104{ background: #6bbd00;} /* 绿色 */
.tags105{ background: #dd1177;} /* 玫红 */
.tags106{ background: ;} /*  */
.tags107{ background: ;} /*  */
.tags108{ background: ;} /*  */
.tags109{ background: ;} /*  */

/* tags背景 */
.tags201,
.tags301,
.tags302 {
    background: url(../../../img/new_v/ob_search/combo.gif) no-repeat; 
    display: inline-block;
    *display: inline;
    *zoom: 1; 
    font-family: Tahoma,Arial,\5b8b\4f53;
    text-indent: 0;
}

/* tags201	促销大ICON-橙色 */
.tags201 { 
    width: 72px; 
    height: 26px;
    line-height: 26px; 
    margin: 0 0 8px 0;
    padding: 0 0 9px 0;
    overflow: hidden; 
    white-space: nowrap;
    background-position: -32px -136px;
    font-size: 12px;
    color: #ee6600;
    text-align: center;
    text-indent: 0;
    top:0 !important;
}

/* tags301	项目tags 301超级自由行 302开心驴行 */
.tags301,
.tags302 {
    display:inline-block; 
    margin:0 2px; 
    height: 17px;
    line-height: 17px;
    width: 76px; 
    overflow: hidden;
    font-size: 12px;
    text-indent: -9999px;
}

.tags301{ background-position: -190px 0; width: 88px;}
.tags302{ background-position: -190px -17px; width: 76px;}









/* 与文本的垂直对齐问题 */
[class^="tags"],
[class*=" tags"],
.tagscc,
.tagsback,
.tagsgift,
.tags101,
.tags102,
.tags103,
.tags104,
.tags105,
.tags106,
.tags107,
.tags108,
.tags109,
.tags301,
.tags302 {
    vertical-align: middle;
    *vertical-align:top;
    position: relative;
    top: -1px;
    *top: 0px;
}

